<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="${path}/statics/layui/css/layui.css">

</head>
<body>
	
     <form class="layui-form" action="" lay-filter="formFilter" style = "padding : 10px;">
     <input type="hidden" name="id" value="${user.id}">
  <div class="layui-form-item">
    <label class="layui-form-label">用户名</label>
    <div class="layui-input-block">
       <input type="text" name="account" id="accountId" value="${user.account}"autocomplete="off" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">密码</label>
    <div class="layui-input-block">
      <input type="text" name="password" id="pwdId" value="111" lay-verify="required" lay-reqtext="密码是必填项，岂能为空？" placeholder="请输入" autocomplete="off" class="layui-input">
    </div>
  </div>
 
  <div class="layui-form-item">
    <div class="layui-inline">
      <label class="layui-form-label">手机号</label>
      <div class="layui-input-inline">
        <input type="tel" name="mobile" id="mobileId" value="${user.mobile}" lay-verify="required|phone" lay-reqtext="手机号是必填项，岂能为空？" autocomplete="off" class="layui-input">
      </div>
    </div>
  
  <!-- 单选框 -->
  <div class="layui-form-item">
    <label class="layui-form-label">性别</label>
    <div class="layui-input-block">
      <input type="radio" name="sex" value="男" title="男" ${user.sex=='男'?'checked':''}>
      <input type="radio" name="sex" value="女" title="女" ${user.sex=='女'?'checked':''}>
      <!--  <input type="radio" name="sex" value="禁" title="禁用" disabled="">  -->
    </div>
  </div>
   <div class="layui-form-item">
    <label class="layui-form-label">生日</label>
    <div class="layui-input-inline">
      <input type="text" name="birthday" placeholder="" autocomplete="off" class="layui-input"  lay-verify="required|date"  id="birthdayId">
    </div>
  </div>
    
    <!-- 地址 -->
   <div class="layui-form-item">
    <label class="layui-form-label">地址</label>
    <div class="layui-input-block">
      <input type="text" name="address" id="addressId" value="${user.address}" lay-verify="required" lay-reqtext="" placeholder="请输入地址" autocomplete="off" class="layui-input">
    </div>
  </div>
  
  <div class="layui-form-item">
    <label class="layui-form-label">管理菜单</label>
    <div class="layui-input-block">
    
    	<c:forEach items="${menuList}" var = "menu" >
    		<input type="checkbox" name="menuId" title="${menu.name}" value="${menu.id}"
    		<c:forEach items="${user.menuId}"  var="men" >
    		    ${menu.id == men?'checked':''}
    		 </c:forEach> 
    		>
    	 </c:forEach>
    </div>
  </div>

  
  <div class="layui-form-item">
    <div class="layui-input-block">
      <button type="submit" class="layui-btn" name="submit" id="saveBtnID" lay-submit lay-filter="saveBtn">保存</button>
      <button type="reset" class="layui-btn layui-btn-primary">重置</button>
    </div>
  </div>
</form>
  
	
<script src="${path}/statics/layui/layui.js"></script>
<script>
//JavaScript代码区域
layui.use(['form','laydate','jquery','layer',"table"], function(){
  var form = layui.form;
  var $ = layui.jquery;
  var layer = layui.layer;
  var table = layui.table;
  var laydate = layui.laydate //日期

  //渲染日期框
  laydate.render({
	  elem:'#birthdayId',
	  trigger:'click',
	  value:"${user.birthday}"
  })
  
  form.verify({
	  account: function(value, item){ //value：表单的值、item：表单的DOM对象
	  
	    if(!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)){
	    	
	      return '用户名不能有特殊字符';
	    }
	    if(/(^\_)|(\__)|(\_+$)/.test(value)){
	      return '用户名首尾不能出现下划线\'_\'';
	    }
	    if(/^\d+\d+\d$/.test(value)){
	      return '用户名不能全为数字';
	    }
	  }
	  
	  //我们既支持上述函数式的方式，也支持下述数组的形式
	  //数组的两个值分别代表：[正则匹配、匹配不符时的提示文字]
	});      
  
 
	//给表单赋值
 
   
  //获取表单区域所有值
  var data1 = form.val("formTest");
  
  
	  //监听表单的提交,首先会触发表单的验证,
	form.on('submit(saveBtn)', function(data){
		
	  
	  if($("input[name='menuId']:checked").length == 0){
	  		layer.msg("请选择菜单",{icon: 3});
	  		return false;
	  }
	  
	  $.post("${path}/userCtl/saveEditUser",$(data.form).serialize(),function(res){
		  
		  if(res == 0){
			  layer.msg("保存成功",{icon:1},function(){
				  var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
				  parent.layer.close(index); //再执行关闭  
				  
				  //在父级自定义函数 , 在子级调用
				  parent.tools.reloadTable();
			  });
			  
		  }else{
			  layer.msg("系统繁忙,请稍后",{icon:2});
		  }
		
	  })
	  return false;//阻止layui同步表单提交
	});
 	
	  

}); 
</script>



</body>
</html>